<template>
  <div id="app">
    <router-view />
  </div>
</template>
<script></script>
<style lang="less">
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  height: 100%;
}
body,
html {
  height: 100%;
  margin: 0;
  padding: 0;
}
.height100 {
  height: 100%;
}

// 滚动条整体部分，整个滚动条背景
.el-aside::-webkit-scrollbar {
  width: 3px; /*垂直的宽度*/
  height: 5px; /*水平的高度 */
  background-color: #fff;
}
.right-height ::-webkit-scrollbar {
  width: 3px;
  height: 5px;
  background-color: #fff;
}

// 滚动条上的按钮（上、下）  滚动条两端的按钮
.el-aside::-webkit-scrollbar-button {
  width: 5px;
  background-color: rgb(219, 20, 20);
  opacity: 0.3;
}
.right-height ::-webkit-scrollbar-button {
  width: 5px;
  background-color: rgb(219, 20, 20);
  opacity: 0.3;
}
// 滚动条
.el-aside::-webkit-scrollbar-thumb {
  width: 3px;
  background-color: rgb(202, 88, 183);
  border-radius: 3px;
  box-shadow: 0 0 1px red;
}
// 滚动条里面可以拖动的那个
.right-height ::-webkit-scrollbar-thumb {
  width: 3px;
  background-color: rgb(202, 88, 183);
  border-radius: 3px;
  box-shadow: 0 0 1px red;
}
// 滚动条轨道
.el-aside::-webkit-scrollbar-track {
  background-color: rgba(77, 1, 69, 0.8);
  border-radius: 3px;
}
// 外层轨道
.right-height ::-webkit-scrollbar-track {
  background-color: rgba(77, 1, 69, 0.8);
  // border-radius: 3px;
}

.bg-white {
  background-color: #f9f7fa;
}
.mx__20 {
  margin-left: -20px;
  margin-right: -20px;
}
.mr-20 {
  margin-right: 20px;
}

.py-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}
.my-20 {
  margin-top: 20px;
  margin-bottom: 20px;
}
.mt-20 {
  margin-top: 20px;
}
.px-20 {
  padding-left: 20px;
  padding-right: 20px;
}
.px-10 {
  padding-left: 10px;
  padding-right: 10px;
}
.pr-40 {
  padding-right: 40px;
}
.py-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.current-content-style {
  margin-top: 20px;
  border-radius: 3px;
  padding: 20px;
  background-color: #fafafa;
  box-shadow: 0 0 10px 1px rgba(187, 182, 182, 0.351);
}
.text-right {
  text-align: right;
}
.text-center {
  text-align: center;
}
.br {
  border-right: 1px solid rgb(175, 174, 174);
}

.avatar-uploader .el-upload {
  border: 1px dashed #d9d9d9;
  border-radius: 6px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
}
.avatar-uploader .el-upload:hover {
  border-color: #409eff;
}
.avatar-uploader-icon {
  font-size: 28px;
  color: #8c939d;
  width: 178px;
  height: 178px;
  line-height: 178px;
  text-align: center;
}
.avatar {
  width: 178px;
  height: 178px;
  display: block;
}

.btn-back {
  width: 200px;
}
.table-header-bg > th {
  color: #fff;
  background-color: #886ab5 !important;
}
.table-header-bg > th:nth-last-child(2) {
  border-radius: 0 5px 0 0;
}
.table-header-bg > th:first-child {
  border-radius: 5px 0 0 0;
}

// 文字状态
.text-success {
  color: green;
}
.text-danger {
  color: red;
}
.text-warning {
  color: orange;
}
.text-primary {
  color: #409eff;
}
.text-20 {
  font-size: 20px;
}
.curser-pointer {
  cursor: pointer;
}
</style>
